<template>
  <span> 获取验证码({{ time }}s) </span>
</template>

<script setup lang="ts">
import { ref, watch } from "vue";

let time = ref<number>(5);
let props = defineProps(["modelValue"]);
const $emit = defineEmits(["update:model-value"]);
watch(
  () => props.modelValue,
  () => {
    let timer
    if(timer) clearInterval(timer) 
    timer = setInterval(() => {
        time.value--;
        if (time.value === 0) {
          $emit("update:model-value", false);
          clearInterval(timer);
        }
      }, 1000);
  },
  {
    immediate: true,
  }
);
</script>

<style scoped></style>
